.phone_box{
    width: 390px;
    height: 663px;
    padding: 20px;
    position: fixed;
    top: 150px;
    right: 50px;
    z-index: 20;
    animation-name: example;
    animation-duration: 0.5s;
    animation-timing-function:ease-in-out;
    div:nth-child(1){
        margin-left: 18px;
    }

    .mask{
        position: absolute;
        top: 0;
        left: 0;
        width: 390px;
        height: 663px;
        background: url('../../../../assets/images/mobile.png') no-repeat left top;
        background-size: cover;
    }
    .close{
        position: absolute;
        top: -12px;
        right: -10px;
        z-index: 21;
        width: 60px;
        height: 60px;
        cursor: pointer;
        img{
            max-width: 100%;
        }
    }
    @keyframes example {
        from {right:-300px}
        to {right:50px}
    }
}